<template>
    <div style="padding: 20px;">
        <el-card v-for="(item,i) in publicData" :key="i" :header="item.group" style="margin-bottom: 20px;">
            <el-alert show-icon v-if="item.group == '咨询记录设置'" title="姓名+手机号重复的咨询在任何设置下，均不允许录入!"
                        type="warning" :closable="false"/>
            <el-table :data="item.items" style="width: 100%">
                <el-table-column width="80">
                    <template #default="{row}">
                        <el-switch v-if="row.fieldType =='switch'" :model-value="Boolean(row.v == 'true'?'1':'')"
                                    @change="updateSwitch(row,$event)"/>
                        <el-input v-else-if="row.fieldType =='input'" v-model="row.v" @change="updateSwitch(row,$event)"/>
                    </template>
                </el-table-column>
                <el-table-column prop="label"/>
            </el-table>
        </el-card>
    </div>
</template>
  
<script setup>
import { ref , onBeforeMount } from 'vue'
//api
import { configPage  , configUpdate } from './api'
//全局设置数据
import config from '@config'

let publicData = ref([]);

onBeforeMount(()=>{
    getConfig()
})

const getConfig = async ()=>{
    let res = await configPage();
    publicData.value = res.data;
    config.settingEnabled = res.data[1].items[0].enabled;
}

//开关
const updateSwitch = async ( row , e  )=>{

    row.v = e;
    const res = await configUpdate({
        id: row.id,
        k: row.k,
        v: e.toString(),
        enabled: e==true ? '1' : '0',
    })
    if( res.code !='200' ) return;
    ElMessage.success('修改成功');
    getConfig();
}
</script>